<template>
  <div class="solution">
      <h2 class="commonTitle solutionTitle">行业案例</h2>
      <div class="solutionTotal w1190">
         <ul class="solutionUl">
             <li class="solutionLi clearfix" v-for="(item,index) in solutionSorts" :key="index">
                <div class="pull-left solutionLeft">
                  <img :src="item.img" alt="" class="pull-left solutionImg">
                </div>
                <div class="pull-left solutionRight">
                    <h3 class="solutionH3">{{item.title}}</h3>
                    <p class="solutionText">{{item.text}}</p>
                    <a href="javascript:;" class="solutionMore">{{item.detail}}</a>
                </div>
             </li>
         </ul>
      </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      solutionSorts: [
        {
          img:"img/solution/jinrong.png",
          title: "金融服务解决方案",
          text:
            "互联网金融平台与五孚签通过webservice接口建立本地业务系统的独立电子签约模块，实现在线签约，批量签署，批量下载等强大功能，五孚签配备完整的实名认证体系和电子签约技术，合同文件同步云存，拒绝莫名篡改，无缝对接权威司法鉴定，电子证据直推仲裁机构",
          detail: "了解详情"
        },
        {
          img:"img/solution/baoxian.png",
          title: "保险行业解决方案",
          text: "五孚签的数字交易管理解决方案可帮助财产保险股份有限公司运营商来满足现代消费者各类保险需求",
          detail: "了解详情"
        },
        {
          img:"img/solution/yiliao.png",
          title: "医疗健康解决方案",
          text:
            "通过数字化平台改善顾客体验，医疗数据源头存证，将各类医疗电子数据进行证据保全，云端存证防篡改，无缝对接权威司法鉴定，有效保护医患关系",
          detail: "了解详情"
        },
        {
          img:"img/solution/lingshou.png",
          title: "零售解决方案",
          text:
            "零售商系接入电子合同，五孚签根据当前交易价格生成合同内容，供应双方可以实现实时在线合同修改和签署流程，五孚签分类管理统计对接平台签署合同和记录查找管理方便",
          detail: "了解详情"
        }
      ]
    };
  }
};
</script>

<style lang="less">
.solution {
  margin: 60px auto 80px auto;
  .solutionTitle {
    margin-bottom: 60px;
  }
  .solutionUl {
    .solutionLi {
      border-bottom: 1px dashed #dddddd;
      padding: 25px 0;
      .solutionLeft {
        width: 292px;
        height: 182px;
        .solutionImg {
          display: block;
          border: 1px solid #eeeeee;
        }
      }
      .solutionRight {
        margin: 15px 35px 0 70px;
        .solutionH3 {
          font-size: 1.6rem;
          font-weight: bold;
          color: #3a3a3a;
        }
        .solutionText {
          width: 740px;
          margin: 26px 0 20px 0;
          font-size: 1.4rem;
          line-height: 18px;
          color: #6a6a6a;
        }
        .solutionMore {
          font-size: 1.4rem;
          //   color: #0060ef;
          color: #3a3a3a;
          cursor: default;
        }
      }
    }
  }
}
</style>

